<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <link rel="icon" href="/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title></title>
</head>

<body>
	<div>index.html</div>
	<div class="getbox"></div>
	<div class="postbox"></div>
	<div class="getUserInfo"></div>
	<div class="postUserInfo"></div>
	<button onclick="getUserInfo()">发送get方法获取用户信息</button>
	<button onclick="postUserInfo()">发送post方法获取用户列表</button>


	<button id="msg">发送消息给服务器端</button>
	<p>服务器发给我的消息: <span id="msg">0</span></p>


	<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
	<script src="/javascripts/socket.io.min.js"></script>
	<!-- <script src="https://cdn.socket.io/socket.io-1.4.5.js"></script> -->
    <script>

    	let baseUrl = "http://localhost:3000";


    	axios.get(baseUrl+'/scene/getData',{params:{a:1,b:2}})
		  .then(function (response) {
		    	console.log(response.data.data);
		   		document.querySelector(".getbox").innerHTML = JSON.stringify(response.data.data);
		  })
		  .catch(function (error) {
		    console.log(error);
		  });


        axios.post(baseUrl+'/scene/postData', {
		    firstName: 'Fred',
		    lastName: 'Flintstone'
		})
		.then(function (response) {
		    document.querySelector(".postbox").innerHTML = JSON.stringify(response.data.data);
		})
		.catch(function (error) {
		    console.log(error);
		});



		function getUserInfo(){
			axios.get(baseUrl+'/users/userInfo',{
				params:{}
			})
		  	.then(function (response) {
		   		document.querySelector(".getUserInfo").innerHTML = JSON.stringify(response.data.data);
		  	})
		  	.catch(function (error) {
		    	console.log(error);
		  	});
		}
		


		function postUserInfo(){
			axios.post(baseUrl+'/users/tableData', {
			    firstName: 'Fred',
			    lastName: 'Flintstone'
			})
			.then(function (response) {
			    document.querySelector(".postUserInfo").innerHTML = JSON.stringify(response.data.data);
			})
			.catch(function (error) {
			    console.log(error);
			});
		}


		window.onload = function(){
			// 建立连接
		   	var socket = io('http://localhost:3000?roomid=1'); 

			socket.on('connect', () => {
				console.log("ok")
			})

			socket.on('chat message', (msg) => {
				console.log(msg)
			})
			

			document.querySelector("#msg").onclick = function(){
				socket.emit('chat message', "哈哈");
			}
		}

    </script>
</body>

</html>